<!--引入公共的模板-->
{{extend './layout.html'}}
{{block 'content'}}
<div class="container mt-5">
  <div class="row boutique">
  <!-- 精品课程 -->
  {{ each boutique}}
    <div class="col-sm-12 col-md-12 col-lg-3 col-xl-3 mb-5">
      <a href="{{ '/detail?id='+$value.article_id }}">
        <div class="card shadow">
          <img src= "{{ $value.thumb }}"  class="card-img-top"  alt="{{ $index }}" style="height: 180px;">
          <div class="card-body">
            <h5 class="card-title">{{ $value.title }}</h5>
            <p class="card-text" style="overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;">{{ $value.intro }} </p>
          </div>
        </div>
      </a>
    </div>
    {{ /each }}
  </div>
</div>

<!-- 分页 -->
<nav class="container mb-5">
  <ul class="pagination justify-content-center">
    <li class="page-item">
      <a class="page-link" href="javascript:;" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
      </a>
    </li>
    {{ each buttonCount }}
      <li class="page-item pageBut"><a class="page-link" href="{{ '/boutique?page='+($index+1) }}">{{ $index+1 }}</a></li>
    {{ /each }}
    <li class="page-item">
      <a class="page-link" href="javascript:;" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
      </a>
    </li>
  </ul>
</nav>
{{/block}}